<template>
    <div>
        <h2>{{ msg }}</h2>
        <h2>学生名称:{{ name }}</h2>
        <h2>学生性别:{{ sex }}</h2>
        <h2>学生年龄:{{ myAge + 1 }}</h2>
        <button @click="updateAge">尝试修改已收到的年龄</button>
    </div>
</template>

<script>
export default {
    name: 'Student',
    data() {
        return {
            msg: "我是一名国防科技大学的学生",
            myAge: this.age
        }
    },
    methods: {
        updateAge() {
            this.myAge++
        }
    },
    // 简单声明接收
    // props: ['name', 'sex', 'age']

    //接收的同时对数据进行类型限制
    // props:{
    //     name:String,
    //     sex:String,
    //     age:Number
    // }

    // 接收的同时对数据进行 类型限制 + 默认值的指定 + 必要性的限制
    props: {
        name: {
            //name的类型是字符串
            type: String,
            //name是必要的
            required: true
        },
        sex: {
            //name的类型是字符串
            type: String,
            //name是必要的
            required: true
        },
        age: {
            //name的类型是字符串
            type: Number,
            //默认值
            default: 99
        }
    }
}
</script>